<template>
    <div>
        成果标题：<el-input v-model="news.title" placeholder="请输入新闻标题" style="width: 30%"></el-input>

        <div>成果详细内容：
            <div id="wangeditor">
                <div ref="editorElem" style="text-align:left;"></div>
            </div>
            <el-button type="primary" size="small" @click="submitNews">提交</el-button>
        </div>

    </div>

</template>
<script>
    import E from "wangeditor";
    export default {
        name: "Editor",
        data(){
            return {
                editor: null,
                news: {
                    title:'',
                    info:''
                }
            }
        },
        mounted() {
            this.editor = new E(this.$refs.editorElem);
            this.editor.customConfig.showLinkImg = true;
            this.editor.customConfig.uploadImgServer = 'http://121.196.151.13:8088/upload/picture';
            this.editor.customConfig.uploadFileName = 'file';

            // 编辑器的事件，每次改变会获取其html内容
            this.editor.customConfig.onchange = html => {
                this.news.info = html;
            };
            this.editor.customConfig.menus = [
                // 菜单配置
                'head', // 标题
                'bold', // 粗体
                'fontSize', // 字号
                'fontName', // 字体
                'italic', // 斜体
                'underline', // 下划线
                'strikeThrough', // 删除线
                'foreColor', // 文字颜色
                'backColor', // 背景颜色
                'link', // 插入链接
                'list', // 列表
                'justify', // 对齐方式
                'quote', // 引用
                'emoticon', // 表情
                'image', // 插入图片
                'table', // 表格
                'code', // 插入代码
                'undo', // 撤销
                'redo' // 重复
            ];
            this.editor.create();
        },
        methods:{
            submitNews(){
                console.log(this.news.title+"kjhajdhaj生活");
                this.centralControl.axios.centralControl(
                    'addResult',
                    res => {
                        this.$message({
                            message: '添加新闻成功',
                            type: 'success'
                        });
                        this.$router.push("/adminResearchFindings")
                    },
                    this.news
                );
            }

        }
    }
</script>
<style lang="less" scoped>
    .right-nr {
        font-size: 16px;
        color: #666;
        position: relative;
        padding-bottom: 50px;
    }
    .view-title {
        text-align: center;
        line-height: 28px;
        color: #333;
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 18px;
        margin-top: 20px;
        h1 {
            color: red;
            font-size: 18px;
        }
    }
    .view-info {
        text-align: center;
        color: #999;
    }
    .view-info span {
        font-size: 14px;
        font-weight: normal;
    }
    .view-cnt {
        margin-top: 10px;
        line-height: 29px;
    }

</style>
